// components/nav/nav.js
const defaultData = {
    numOneRow: 5,
    //每行图标数量，默认为5
    pageSwich: true,
    //是否打开分页,默认不打开
    style: 1,
    //风格，1——图标，2-文字，3——图标+文字
    iconBorderCircle: 3,
    //1——圆形，2——方形，3——圆角
    mainColor: "#000",
    fullScreen: false
};

Component({
    /**
   * 组件的属性列表
   */
    options: {
        addGlobalClass: true
    },
    properties: {
        getNavData: {
            type: Object
        },
        color_main: {
            type: Object
        },
        nav_style: {
            type: Number
        },
        cate_id: {
            type: String
        }
    },
    /**
   * 组件的初始数据
   */
    data: {
        height: 0,
        current: 0
    },
    /**
   * 组件的方法列表
   */
    methods: {
        /**
     * 数据处理
     */
        processData() {
            let that = this;
            var data = that.data;
            var getNavData = that.properties.getNavData;
            var styleData = {
                ...defaultData,
                ...getNavData.styleData
            };
            that.setData({
                getNavData: {
                    navData: getNavData.navData,
                    styleData: styleData
                }
            });
            var data = that.data.getNavData;
            if (data.navData) {
                //有导航数据
                var num = data.styleData.local_num == 1 ? 4 : 5;
                //每行数量
                                var navLength = data.navData[0].length;
                //导航数量
                                var rows = Math.ceil(navLength / num);
                var width = parseFloat(1 / num * 100);
                if (!data.styleData.pageSwich) {
                    //不分页
                    if (rows > 0) {
                        //行数大于1
                        that.getRowHeight(function(res) {
                            var h = res;
                            if (h != -1) {
                                that.setData({
                                    height: h * rows,
                                    width: width
                                });
                            }
                        });
                    }
                } else {
                    //分页
                    if (rows > 1) {
                        //行数大于1
                        that.getRowHeight(function(res) {
                            var h = res;
                            var pages = Math.ceil(navLength / (num * 2));
                            var newNavData = [];
                            if (h != -1) {
                                for (var i = 0; i < pages; i++) {
                                    var itemArry;
                                    if (i < pages - 1) {
                                        itemArry = data.navData[0].slice(i * num * 2, (i + 1) * num * 2);
                                    } else {
                                        itemArry = data.navData[0].slice(i * num * 2);
                                    }
                                    newNavData.push(itemArry);
                                }
                                that.setData({
                                    height: h * 2,
                                    width: width,
                                    getNavData: {
                                        navData: newNavData,
                                        //分页，重新渲染数据,
                                        styleData: data.styleData
                                    }
                                });
                            }
                        });
                    } else {
                        //一行
                        that.getRowHeight(function(res) {
                            that.setData({
                                height: res * 1,
                                width: width
                            });
                        });
                    }
                }
            }
        },
        /**
     * 获取行高
     */
        getRowHeight(callBack) {
            var height = -1;
            var that = this;
            const query = that.createSelectorQuery();
            query.select("#nav_id").boundingClientRect();
            query.selectViewport().scrollOffset();
            query.exec(function(res) {
                //获取单项高度
                if (res[0]) {
                    callBack(res[0].height);
                }
            });
        },
        /**
     * 轮播切换
     */
        swiperChange(e) {
            this.setData({
                current: e.detail.current
            });
        },
        goToPages(e) {
            var myEventDetail = {
                // detail对象，提供给事件监听函数  //监听函数可以通过e.detail查看传递的数据;　　　
                id: e.currentTarget.dataset.id
            };
            var myEventOption = {};
            // 触发事件的选项
                        this.triggerEvent("myevent", myEventDetail, myEventOption);
        }
    },
    //组件生命周期
    lifetimes: {
        attached() {},
        ready() {
            let that = this;
            that.processData();
        }
    },
    pageLifetimes: {},
    observers: {
        nav_style: function() {
            this.processData();
        }
    }
});